<template>
  <div class="search-content">
    <Navbar :appTitle="title" :rtitle="rtitle" :rname="rname" />
    <div class="formgroup">
      <span class="title">生产负责人</span>
      <van-field
        is-link
        readonly
        name="picker"
        @click="chooseUser"
        v-model="fzrName"
        placeholder="请选择"
      >
      </van-field>
      <span class="title">工艺路线</span>
      <van-field
        name="picker"
        v-model="params.craftName"
        placeholder="请输入"
      >
      </van-field>
    </div>
    <div class="formgroup">
      <span class="title">承诺交期开始时间</span>
      <van-field
        is-link
        readonly
        name="picker"
        @click="promiseDateStartVisible = true"
        placeholder="请选择"
        v-model="params.promiseDateBegin"
      >
      </van-field>
      <span class="title">承诺交期结束时间</span>
      <van-field
        is-link
        readonly
        name="picker"
        @click="promiseDateEndVisible = true"
        placeholder="请选择"
        v-model="params.promiseDateEnd"
      >
      </van-field>
      <span class="title">订单提交开始时间</span>
        <van-field is-link readonly name="picker" v-model="params.createdTimeBegin" @click="createdTimeBeginVisible=true" placeholder="请选择">
      </van-field>
      <span class="title">订单提交结束时间</span>
        <van-field is-link readonly name="picker" v-model="params.createdTimeEnd" @click="createdTimeEndVisible=true" placeholder="请选择">
      </van-field>
      <span class="title">订单提交人</span>
      <van-field
        is-link
        readonly
        name="picker"
        v-model="createdByName"
        @click="ddthrVisible = true"
        placeholder="请选择"
      >
      </van-field>
      <span class="title">销售合同编号</span>
      <van-field v-model="params.contractCode" label="请输入" />
       
     
    </div>
     <!-- <upload  iconType="fj" @fileChange="fileChange"
     :fileIds="fileIds"
     ></upload> -->
    <div class="search-bottom">
      <span class="btncancel" @click="cancel">取消</span>
      <span class="btnconfirm" @click="confirm">确定</span>
    </div>

    <!--承诺交期开始时间 -->
    <van-popup v-model="promiseDateStartVisible" position="bottom">
      <van-datetime-picker
        @confirm="confirmPromiseStartTime"
        @cancel="cancelPromiseStartTime"
        type="datetime"
        title="选择使用时间"
        :min-date="minDate"
        :formatter="formatter"
      />
    </van-popup>
      <!--承诺交期结束时间 -->
    <van-popup v-model="promiseDateEndVisible" position="bottom">
      <van-datetime-picker
        @confirm="confirmPromiseEndTime"
        @cancel="cancelPromiseEndTime"
        type="datetime"
        title="选择使用时间"
        :min-date="minDate"
        :formatter="formatter"
      />
    </van-popup>

    <!--订单提交开始时间 -->
    <van-popup v-model="createdTimeBeginVisible" position="bottom">
      <van-datetime-picker
        @confirm="confirmCreatedStartTime"
        @cancel="cancelCreatedStartTime"
        type="datetime"
        title="选择使用时间"
        :min-date="minDate"
        :formatter="formatter"
      />
    </van-popup>
      <!--订单提交结束时间 -->
    <van-popup v-model="createdTimeEndVisible" position="bottom">
      <van-datetime-picker
        @confirm="confirmCreatedEndTime"
        @cancel="cancelCreatedEndTime"
        type="datetime"
        title="选择使用时间"
        :min-date="minDate"
        :formatter="formatter"
      />
    </van-popup>
    <contact-pickers :visible="fzrVisible" @confirm="confirmChooseUsers">
    </contact-pickers>
    <contact-pickers :visible="ddthrVisible" @confirm="confirmDdtjr">
    </contact-pickers>
  </div>
</template>

<script>
import Navbar from "@/components/navBar/navBar_right";
import ContactPickers from "@/components/choiceuse/ContactPickers";
import upload from "@/components/upload/upload";
import moment from "moment";
export default {
  name: "search",
  components: { Navbar, ContactPickers,upload},
  data() {
    return {
      title: this.$route.meta.title,
      fzrVisible: false,
      ddthrVisible: false,
      promiseDateStartVisible: false,
      promiseDateEndVisible: false,
      createdTimeBeginVisible:false,
      createdTimeEndVisible:false,
      fzrName: "", //生产负责人
      createdByName: "", //订单提交人
      rtitle: "",
      rname: "", //search
      fileIds:"1509889200026275842,1510083205250818050,1509894546648190978",
      minDate: new Date(2020, 1, 1),
      maxDate: new Date(2025, 10, 1),
      params: {
        status: 0,
        chargeUserId: "", //生产负责人ID
        craftName: "",
        contractCode: "",
        createdBy: "",
        promiseDateBegin: "",
        promiseDateEnd: "",
        createdTimeBegin:"",
        createdTimeEnd:"",

      },
    };
  },
  computed: {},
  mounted() {},
  created() {},
  methods: {
    fileChange(ids){
      console.log("父组件"+ids)
    },
    confirmPromiseStartTime(date) {
      this.params.promiseDateBegin = moment(date).format("YYYY-MM-DD HH:mm");
      console.log(date);
      console.log(this.params.promiseDateBegin);
      this.promiseDateStartVisible = false;
    },
    cancelPromiseStartTime() {
      this.params.promiseDateBegin = "";
      this.promiseDateStartVisible = false;
    },
    confirmPromiseEndTime(date){
      this.params.promiseDateEnd = moment(date).format("YYYY-MM-DD HH:mm");
      console.log(date);
      console.log(this.params.promiseDateEnd);
      this.promiseDateEndVisible = false;
    },
    cancelPromiseEndTime(){
      this.params.promiseDateEnd = "";
      this.promiseDateEndVisible = false;
    },
    confirmCreatedStartTime(date){
      this.params.createdTimeBegin = moment(date).format("YYYY-MM-DD HH:mm");
      console.log(date);
      console.log(this.params.createdTimeBegin);
      this.createdTimeBeginVisible = false;
    },
    cancelCreatedStartTime(){
      this.createdTimeBeginVisible = false;
      this.params.createdTimeBegin=""
    },
    confirmCreatedEndTime(date){
      this.params.createdTimeEnd = moment(date).format("YYYY-MM-DD HH:mm");
      console.log(date);
      console.log(this.params.createdTimeEnd);
      this.createdTimeEndVisible = false;
    },
    cancelCreatedEndTime(){
       this.createdTimeEndVisible = false;
       this.params.createdTimeEnd="";
    },
    formatter(type, val) {
      if (type === "year") {
        return val + "年";
      }
      if (type === "month") {
        return val + "月";
      }
      if (type === "day") {
        return val + "日";
      }
      if (type === "hour") {
        return val + "时";
      }
      if (type === "minute") {
        return val + "分";
      }
      return val;
    },
    chooseUser() {
      this.fzrVisible = true;
    },
    confirmChooseUsers(val, selectedList, judge) {
      this.params.chargeUserId = "";
      this.fzrName = "";
      if (judge) {
        this.fzrVisible = false;
        return;
      }
      this.params.chargeUserId = val ? val : ""; //人员id
      let arr = [];
      if (selectedList) {
        selectedList.forEach((item) => {
          arr.push(item.realname);
        });
      }
      this.fzrName = arr.join(",");
      this.fzrVisible = false;
    },
    confirmDdtjr(val, selectedList, judge) {
      this.params.createdBy = "";
      this.createdByName = "";
      if (judge) {
        this.ddthrVisible = false;
        return;
      }
      this.params.createdBy = val ? val : ""; //人员id
      let arr = [];
      if (selectedList) {
        selectedList.forEach((item) => {
          arr.push(item.realname);
        });
      }
      this.createdByName = arr.join(",");
      this.ddthrVisible = false;
    },
    cancel() {},
    confirm() {
      this.$router.push({ path: "/carRoomList" });
    },
  },
};
</script>
<style lang="scss" scoped>
.search-content {
   padding-bottom: 0.5rem;
  .formgroup {
    background: #ffffff;
    // padding: 0 0.16rem;
    margin-bottom: 0.2rem;
    padding-top: 0.1rem;
   
    .title {
      width: 0.58rem;
      height: 0.14rem;
      font-size: 0.15rem;
      font-family: PingFang SC;
      font-weight: 400;
      color: #191f25;
      line-height: 0.05rem;
      margin-left: 0.16rem;
    }
  }
  .search-bottom {
    height: 0.5rem;
    width: 100%;
    background: #ffffff;
    // background: red;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    bottom: 0px;
    padding: 0.11rem;
    .btnconfirm {
      width: 1.72rem;
      height: 0.39rem;
      background: #1890ff;
      border-radius: 0rem;
      text-align: center;
      line-height: 0.39rem;
    }
    .btncancel {
      width: 1.72rem;
      height: 0.39rem;
      background: #f6f6f6;
      border: 0.01px solid rgba(25, 31, 37, 0.12);
      border-radius: 0rem;
      text-align: center;
      line-height: 0.39rem;
    }
  }
}
</style>